<template>
<div>
    <div class="register-head">
        <div class="register-left">
            <router-link to='/'>
                    <div class="btn-back"></div>
            </router-link>
        </div>
            
        <div class="register-title">
            <h4>注册账号</h4>
        </div>
    </div>
    <div class="register-box">
        <div class="step">输入手机号&nbsp;>&nbsp;输入验证码&nbsp;>&nbsp;设置密码</div>
        <input type="text" class="usename" placeholder="请输入您的手机号"></input>
        <p><input type="checkbox" checked="checked" class="checkbox">我已阅读并同意<span>《美团网用户协议》</span></p>
        <button class="btn">获取验证码</button>
    </div>
    
</div>
</template>
<script>
</script>
<style>
*{
    margin:0;
    padding:0;
    list-style: none;
}
body {
    background-color: #f0f0f0;
    font-family: "微软雅黑";
    font-size: 14px;
    color: #444;
}
.register-head{
    background-color: #06c1ae;
    color: #fff;
    height: 50px;
    line-height: 50px;
    width: 100%;
    border-bottom: 1px solid #21897d;
}
.register-head .register-left{
    float:left;
    width:60px;
    height: 50px;
}
.register-head .register-left .btn-back{
    margin-top:15px;
    margin-left:20px;
    transform:rotate(45deg);
    width:20px;
    height:20px;
    border-left:4px solid #fff;
    border-bottom:4px solid #fff;
}
.register-head .register-title{
    float:left;
    margin-left:100px;
    height: 50px;
    width:80px;
    text-align:center;
}
.register-head .register-title h4{
    line-height:50px;
    color:#fff;
    font-size:16px
}
.register-box .step{
    background-color:#fff;
    width:100%;
    height:43px;
    line-height:43px;
    padding-left:13px;
    border:0;
    font-size:17px;
    border-bottom:1px solid #DDD8CE;
}
.register-box .usename{
    width:100%;
    height:43px;
    margin-top:20px;
    padding-left:13px;
    border:0;
    font-size:17px;
    border-top:1px solid #DDD8CE;
    border-bottom:1px solid #DDD8CE;
}
.register-box .btn{
    margin-left:1%;;
    width:94%;
    height:45px;
    margin-top:20px;
    border:0;
    color: #fff;
    background-color: #06c1ae;
    font-size:20px;
    border-radius:5px;
}
.register-box p{
    text-align:left;
    margin-left:15px;
    font-size:16px;
    margin-top:10px;
}
.register-box p .checkbox{
    height:14px;
    width:14px;
    margin-right:5px;
}
.register-box p span{
    color: #06c1ae;
}
</style>